<template>
  <div>
    <h2>music</h2>
    <ul>
      <li v-for="music in musicList" :key="music">{{ music }} {{ time }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "Music",
  computed: {
    musicList() {
      switch (Number(this.$route.params.id)) {
        case 1:
          return ["晚夜微雨问海棠", "满庭芳", "人间白首", "清绝"];
        case 2:
          return ["为霜", "所念皆星河", "女神の诗", "星茶会"];
        case 3:
          return ["Door", "Home", "Top Down", "courage"];
        default:
          return [];
      }
    },
  },
};
</script>

<style scoped>
ul {
  list-style: none;
  margin-left: -30px;
}
</style>
